import React, { Component } from 'react'
import DetailUI from '../detailPage'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
// import Common from '../commonList/common'





@withRouter

@connect(
    state => {
        return ({
            detail2: state.getIn(['detail', 'detail']),
            commonList: state.getIn(['detail', 'common'])

        })
    },
    dispatch => ({
        loadDetailData(tid) {
            // console.log('saddas1')
            dispatch({
                type: 'SAGA_LOAD_DETAIL_DATA',
                paylod: tid
            }),
                dispatch({
                    type: 'SAGA_LOAD_COMMON_DATA',
                    paylod: tid
                })
        }
    })
)
class detailCon extends Component {
    state={

    }
    componentDidMount() {
        let tid = this.props.history.location.pathname.split('/')[2]
        this.props.loadDetailData(tid)
        setTimeout(()=>{
           this.setState({})
        },1000)
        // 监听路由变化
        // this.listen = this.props.history.listen((route) => {
        //     let tid = this.props.history.location.pathname.split('/')[2]
        //     this.props.loadDetailData(tid)

        // })

    }
    componentWillUnmount() {
        // this.listen()
    }

    shouldComponentUpdate() {
        return this.props.commonList && this.props.detail2
        
    }


    render() {
        // console.log(jthis.props.detail2)

        return (
            <div style={{
                height: '100%'
            }}>

                {

                    this.props.commonList && this.props.detail2 && <DetailUI
                        news={this.props.detail2
                        }></DetailUI>


                }
            </div>
        )
    }
}



export default detailCon